import { FloatButton } from "antd";
import { MoonOutlined, SettingOutlined } from "@ant-design/icons";
import { useCallback, useEffect } from "react";
import { useMyContext } from "@/hooks";

const BackTop = () => {
  const { messageApi } = useMyContext();
  const handleClick = useCallback(() => {
    messageApi.info("功能开发中...");
  }, []);

  return (
    <>
      <FloatButton.Group
        style={{
          right: 24,
        }}
      >
        <FloatButton icon={<MoonOutlined />} onClick={handleClick} />
        <FloatButton icon={<SettingOutlined />} onClick={handleClick} />
        <FloatButton.BackTop />
      </FloatButton.Group>
    </>
  );
};

export default BackTop;
